<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/jquery-3.3.1.js"></script>
    <script>
        $(f);

        function f(){
//            $("#d1").bind("click",function(){
//                alert(1);
//            });
//            $("#d1").bind("click",function(){
//                alert(2);
//            });
            $("#d1").bind({
                "mouseover":function(){
                    console.log("mouseover");
                },
                "mouseout":function(){
                    console.log("mouseout");
                },
                "mouseenter":function(){
                    console.log("mouseenter");
                },
                "mouseleave":function(){
                    console.log("mouseleave");
                }
            });
        }
    </script>
</head>
<body>

<div id="d1" style="background:red;">123</div>

</body>
</html>